/**
 * Created by Franklin on 2017/3/21.
 */

var React = require('react');
var Axios = require('axios');

var ModelSerInfo = React.createClass({
    getInitialState : function () {
        return {
            loading : true,
            err : null,
            ms : null
        };
    },

    componentDidMount : function () {
        Axios.get(this.props.source).then(
            data => {
                this.setState({loading : false, ms : data.data.data });
            },
            err => {
                this.setState({loading : false, err : err });
            }
        );
    },

    render : function () {
        if(this.state.loading){
            return (
                <span className="" >loading...</span>
            );
        }
        if(this.state.ms == null)
        {
            return (
                <span>Can not find data</span>
            );
        }
        var platform = (
            <span className="label label-info">Unknown</span>);
        if(this.state.ms.ms_platform == 1)
        {
            platform = (
                <span className="label label-info">
                    <i className="fa fa-windows"> </i> windows
                </span>);
        }
        else if(this.state.ms.ms_platform == 2)
        {
            platform = (
                <span className="label label-info">
                    <i className="fa fa-linux"> </i>linux
                </span>);
        }
        var status = (
            <span className="badge badge-defult">Unavai</span>);
        if(this.state.ms.ms_status == 1)
        {
            status = (
                <span className="badge badge-success">Avai</span>
            );
        }
        var detail = '';
        if(this.state.ms.ms_model.m_url)
        {
            detail = (
                <a href={this.state.ms.ms_model.m_url} >MORE</a>
            );
        }
        var img = (<img src="/images/model_default.png" alt=""  />);
        var url = window.location.href;
        url = url.substr(0, url.lastIndexOf(':') + 5);
        var permission = null;
        if(this.state.ms.ms_permission == 1){
            permission = (
                    <span className="label label-default tooltips" data-toggle="tooltip" data-placement="top" data-original-title={window.LanguageConfig.ModelService.Auth} >
                        <i className="fa fa-lock" ></i>&nbsp;{window.LanguageConfig.ModelService.Auth}
                    </span>);
        }
        else{
            permission = (
                    <span className="label label-success tooltips" data-toggle="tooltip" data-placement="top" data-original-title="Open" >
                        <i className="fa fa-unlock" ></i>&nbsp;Open
                    </span>);
        }
        return (
            <div className="panel panel-primary">
                <div className="panel-heading">
                    Task Building
                </div>
                <div className="panel-body">
                    <div className="row">
                        <div className="col-md-2">
                            <div className="blog-img">
                                {img}
                            </div>
                        </div>
                        <div className="col-md-7">
                            <p className="muted" >Name&nbsp;:&nbsp;{this.state.ms.ms_model.m_name}</p>
                            <p className="muted" >Type&nbsp;:&nbsp;{this.state.ms.ms_model.m_type}</p>
                            <p className="muted" >Version&nbsp;:&nbsp;{this.state.ms.mv_num}</p>
                            <p className="muted" >Platform&nbsp;:&nbsp;{platform}</p>
                            <p className="muted" >DeploymentTime&nbsp;:&nbsp;{(new Date(this.state.ms.ms_update)).toLocaleString()}</p>
                            <p className="muted" >Status&nbsp;:&nbsp;{status}</p>
                            <p className="muted" >Permission&nbsp;:&nbsp;{permission}</p>
                            <p  className="muted" >Description&nbsp;:&nbsp;{this.state.ms.ms_des}</p>
                            <br />{detail}
                            <br />
                        </div>
                    </div>
                </div>
            </div>
        );
    }
});

module.exports = ModelSerInfo;